<%--
    Document   : consultarSolicitud
    Created on : 01/02/2011, 07:19:16 PM
    Author     : glpc_2
--%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<% request.setAttribute("allowed", "Recibir y Atender Solicitudes");%>
<%@ include file='../Templates/security.jsp' %>

<h1 class="title">Gestión de Solicitudes</h1>
<p class="meta"></p>
<div class="entry">
    <center>
        <h2>Atender Solicitud</h2>
        <br>
        <form id="consultarSolicitudForm" action="javascript:void(0);">
            <table>
                <tr>
                    <td>Estado:</td>
                    <td>
                        <select id="status" name="status" class='filter'>
                            <option value="">-</option>
                            <option value="Pendiente">Pendiente</option>
                            <option value="En Proceso">En Proceso</option>
                            <option value="Atendido">Atendido</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td> Fecha de creación de la Solicitud :</td>
                    <td><input  name="fecha_solicitud"  id="fechaS" class='filter'/></td>
                </tr>
                <tr>
                    <td> Fecha de ocurrencia del incidente :</td>
                    <td><input  name="fecha_ocurrencia"  id="fechaO" class='filter'/></td>
                </tr>
                <tr>
                    <td>Categoría:</td>
                    <td><select id="categoria" name="categoria" class="filter">
                            <option value="">-</option>
                            <option value="Estudio de Enfermedad Ocupacional">Estudio de Enfermedad Ocupacional</option>
                            <option value="Evaluacion de Riesgo Ambiental">Evaluación de Riesgo Ambiental</option>
                            <option value="Inspeccion de Riesgo">Inspección de Riesgo</option>
                            <option value="Levantamiento de Riesgos de Puesto de Trabajo">Levantamiento de Riesgos de Puesto de Trabajo</option>
                            <option value="Evaluacion de Incidente">Evaluación de Incidente</option>
                            <option value="Señalizacion">Señalización</option>
                            <option value="Sistema contra Incendio">Sistema contra Incendio</option>
                        </select>
                    </td>
                </tr>
            </table>
            <br>
            <html:button property="" value="Mostrar Todo" onclick="consultarSolicitudesTodo()"/>
            <html:button property="" value="Consultar" styleId="consultarForm" onclick="consultarSolicitudes()" styleClass="oculta"/>
            <html:reset property="" styleId="resetForm" value="Limpiar" styleClass="oculta"/>
            <html:button property="" styleClass="back" value="Atrás"/>
        </form>
        <br>
        <div id="obs"></div><br>
        <div id="consultarSol">
            <table cellpadding="0" cellspacing="0" border="0" id="table" class="sortable">
                <thead id="head">
                    <tr>
                        <th><h5><div class="ordenar" onclick="orden('nombre');" >Solicitante</div></h5></th>
                        <th><h5><div class="ordenar" onclick="orden('fecha_solicitud');" >Fecha Solicitud</div></h5></th>
                        <th><h5><div class="ordenar" onclick="orden('status');" >Status</div></h5></th>
                        <th><h5><div class="ordenar" onclick="orden('prioridad');" >Prioridad</div></h5></th>
                        <th><h5><div class="ordenar" onclick="orden('categoria');" >Categoría</div></h5></th>
                        <th><h5><div class="ordenar" onclick="orden('fecha_ocurrencia');" >Fecha Ocurrencia</div></h5></th>
                        <th><h5><div class="ordenar" onclick="orden('descripcion');" >Detalles</div></h5></th>
                        <th><h5>Atender</h5></th>
                        <th><h5 class="detalle">Detalles</h5></th>
                    </tr>
                </thead>
                <tbody id="resultado"></tbody>
            </table>
            <br>
            <%@ include file="../Templates/paginasTabla.jsp" %>
            <div id="detallesSolicitud"></div>
        </div>
    </center>
</div>
<br>
<script type="text/javascript">
    $(function() {
        consultarSolicitudes();
        $("#consultarSol").hide();
        $("#fechaS").datepicker({
            dateFormat: 'dd/mm/yy',
            maxDate: new Date(),
            showOn: "button",
            buttonImage: "style/images/calendar.gif",
            buttonText: "calendario"
        }).attr('readonly', true);
        $("#fechaO").datepicker({
            dateFormat: 'dd/mm/yy',
            maxDate: new Date(),
            showOn: "button",
            buttonImage: "style/images/calendar.gif",
            buttonText: "calendario"
        }).attr('readonly', true);
        $('#detallesSolicitud').dialog({
            autoOpen: false,
            title: 'Detalles de la Solicitud',
            hide: "explode"
        });
    });

    $('.back').click(solicitudesMenu);
    
    $('.filter').change(function(){
        offset = 0;
        consultarSolicitudes();
    });
    
    function consultarSolicitudes(){
        limit = $('#limit').val();
        $.ajax({
            type: 'POST',
            url:"consultarSolicitud.do?limit="+limit+"&offset="+offset+"&order="+order+"&asc="+asc,
            data: $('#consultarSolicitudForm').serialize(),
            dataType: 'json',
            success: proceessConsultarSolicitudes
        });
    }
    
    function proceessConsultarSolicitudes(data) {
        $('#resultado').html("");
        $.each(data.solicitudes, function(i,item){
            if ( (i % 2) == 0) fila = $("<tr bgcolor='#fff' id='solicitud_"+item.id_solicitud+"'>");
            else fila = $("<tr bgcolor='#ecf2f6' id='solicitud_"+item.id_solicitud+"'>");

            fila.append($("<td>").append(item.nombre));
            fila.append($("<td>").append(item.fecha_solicitud));
            fila.append($("<td>").append(item.status));
            switch(item.prioridad){
                case '1':
                    fila.append($("<td>").append("Baja"));
                    break;
                case '2': fila.append($("<td>").append("Media"));
                    break;
                case '3': fila.append($("<td>").append("Alta"));
                    break;
                case '4': fila.append($("<td>").append("Inmediata"));
                    break;
                default: fila.append($("<td>").append("-"));
            }
            fila.append($("<td>").append(item.categoria));
            if(item.categoria=="Evaluacion de Incidente") fila.append($("<td>").append(item.fecha_ocurrencia));
            else fila.append($("<td>").append("-"));

            det = "<img src='style/images/detalles.png' alt='Ver Detalles' width='20' height='20' class='showDetails'>";
            fila.append($("<td>").append(det));

            mod = "<img onclick='return solicitudM("+item.id_solicitud+");' src='style/images/table_edit1.png' alt='Modificar AST' width='20' height='20'>";
            fila.append($("<td>").append(mod));

            detalle = "<p><b>Solicitante: </b>"+item.nombre+"</p>";
            detalle += "<p><b>Telefono: </b>"+item.telefono+"</p>";
            detalle += "<p><b>Correo: </b>"+item.correo+"</p>";
            detalle += "<p><b>Descripcion: </b>"+item.descripcion+"</p>";
            fila.append($("<td id='detalleSolicitud_"+item.id_solicitud+"' class='detalle'>").append(detalle));

            $('#resultado').append(fila);
        });
        $('.detalle').hide();

        $('.showDetails').click(function(){
            nro = $(this).parent().parent().attr('id').replace('solicitud_','');
            detalle = $('#detalleSolicitud_'+nro).html();
            $('#detallesSolicitud').html(detalle);
            $('#detallesSolicitud').dialog("open");
        });

        tam = data.tam
        if(tam==0){
            $("#obs").html('<h4>No hay resultados que coincidan con los parametros dados.</h4>');
            $("#consultarSol").hide();
        } else {
            $("#obs").html('OBSERVACIÓN: Para ordenar la tabla por un campo específico, presionar el nombre de la columna.');
            $("#currentpage").html((offset/limit)+1);
            $("#pagelimit").html(Math.ceil(tam/limit));
            $("#consultarSol").show();
        }
    }

    function consultarSolicitudesTodo(){
        $('#resetForm').click();
        consultarSolicitudes();
    }
</script>